@import
"../../../containers/_common_sass/base";

.header{
    position: fixed;
    z-index: 999;
    top:0;
    height: px2rem($headerHeight);
    width: 100%;
    line-height: px2rem($headerHeight);
    background-color: $blue;
    color: #fff;
    padding: 0 10px;
    text-align: center;
    font-size: px2rem(36px);
    @extend .clearfix;
    .icon-user{
        position: absolute;
        left: px2rem(30px);
        top:50%;
        transform: translateY(-50%);
        width: px2rem(35px);
        height: px2rem(40px);
        background: url(../../../containers/_common_img/my-icon/user-icon.png) no-repeat;
        background-size: cover;
    }
    .side-bar{
        text-align: left;
        @extend .full-screen;
        background: rgba(0,0,0,.5);
        .user-info{
            width: px2rem($sideBarWidth);
            height: 100%;
            background-color: #fff;
            .user-head{
                text-align: center;
                padding-top: 0.6rem;
                img{
                    width: 1.04rem;
                    height: 1.04rem;
                    border-radius: 50%;
                }
                p{
                    color: $text-color-3;
                }
            }
        }
        .control-list{
            margin-top: .6rem;
            li{
                height: 1rem;
                line-height: 1rem;
                font-size: 0.3rem;
                a{
                    display: block;
                    padding: 0 0.5rem;
                    i{
                        display: inline-block;
                        vertical-align: middle;
                        margin: 0 px2rem(30px);
                        width:px2rem(41px);
                        height:px2rem(41px);
                        background-size: cover;
                        background-repeat: no-repeat;

                        &.act-control{
                            background-image: url(../../../containers/_common_img/my-icon/act-man.png);
                        }
                        &.member-control{
                            background-image: url(../../../containers/_common_img/my-icon/vip-man.png);
                        }
                        &.setting-control{
                            background-image: url(../../../containers/_common_img/my-icon/set-man.png);
                        }

                    }

                }
            }

        }

    }
}